<template>
	<el-dialog title="修改" :modal-append-to-body="false" :visible.sync="fileVisible" width="360px">
		<div class="file-content">
			<span class="file-title">文档名称</span>
			<el-input class="file-input" v-model="folderForm.name"></el-input>
		</div>
		<div class="file-content">
			<span class="file-title">文档描述</span>
			<el-input type="textarea" :rows="2" class="file-input" v-model="folderForm.content"></el-input>
		</div>
		<span slot="footer" class="dialog-footer">
			<el-button @click="fileVisible = false">取 消</el-button>
			<el-button type="primary" @click="fileEdit">确 定</el-button>
		</span>
	</el-dialog>
</template>

<script>
	import {queryById ,update} from '@/api/doc.js'
	export default{
		data(){
			return{
			   fileVisible:false,
			   folderForm: {
			   	name: '',
			   	dirId:''
			   }
			}
		},
		props: {
			treeData: {
				type: Object,
				default: null
			},
		},
		methods:{
			// 查看文档详情
		    loadQuery(){
				var _this = this
				// console.log(_this.treeData)
				queryById({id:_this.treeData.docId}).then(res=>{
					console.log(res)
					_this.folderForm = res.data
				})
			},
			// 打开修改弹窗并查询详情
			loadFileEdit() {
				this.loadQuery()
				this.fileVisible = true
			},
			// 修改文档
			fileEdit(){
				var _this = this
				if(!_this.folderForm.name){
					this.$message.error('请输入文件名称');
					return;
				}
				if(!_this.folderForm.content){
					this.$message.error('请输入文件描述');
					return;
				}
				update(_this.folderForm).then(res=>{
					_this.updateDocList(_this.folderForm)
					_this.fileVisible = false
					_this.$message({
						showClose: true,
						message: '修改成功',
						type: 'success'
					});
				})
			},
			// 更新文档
			updateDocList(data){
				var docForm = {
					data:data,
					type:'update'
				}
				console.log('我修改过了 ');
				this.$EventBus.$emit('updateDoc',docForm)
			}
		}
	}
</script>

<style scoped>
	.file-content{
		display: flex;
		flex-direction: column;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.file-title{
		font-size: 14px;
		font-weight: 700;
		color: #2e405e;
		margin-bottom: 10px;
		display: block;
	}

	.file-input{
		flex: 1;
	}

	/deep/.el-dialog .el-dialog__footer{
		border-color: white;
	}

	/deep/.el-dialog__title{
		font-weight: bold;
		font-size: 16px;
	}
</style>
